<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title> - 空白页</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico">
    <link th:href="@{/css/bootstrap.min.css(v=3.3.6)}" rel="stylesheet">
    <link th:href="@{/css/font-awesome.css(v=4.4.0)}" rel="stylesheet">

    <link th:href="@{/css/animate.css}" rel="stylesheet">
    <link th:href="@{/css/style.css(v=4.1.0)}" rel="stylesheet">
    <link th:href="@{/css/plugins/treeview/bootstrap-treeview.css}"  rel="stylesheet">
</head>

<body class="gray-bg">
<div class="row wrapper border-bottom white-bg page-heading">
    <div class="col-sm-4">
        <h2>角色列表</h2>
    </div>
    <div class="col-sm-8">
        <div class="title-action">
            <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#addAdmin">
                新增角色
            </button>
        </div>
    </div>
</div>
</div>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="col-sm-4">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>角色列表</h5>
            </div>
            <div class="ibox-content">
                <p>
                    可使用class来快速改变按钮的颜色，如<code>.btn-primary</code>
                </p>

                <h3 class="font-bold">
                    普通按钮
                </h3>
                <p>
                    <button type="button" class="btn btn-w-m btn-default">btn-default</button>
                    <button type="button" class="btn btn-w-m btn-primary">btn-primary</button>
                    <button type="button" class="btn btn-w-m btn-success">btn-success</button>
                    <button type="button" class="btn btn-w-m btn-info">btn-info</button>
                    <button type="button" class="btn btn-w-m btn-warning">btn-warning</button>
                    <button type="button" class="btn btn-w-m btn-danger">btn-danger</button>
                    <button type="button" class="btn btn-w-m btn-white">btn-white</button>
                    <button type="button" class="btn btn-w-m btn-link">btn-link</button>
                </p>
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>菜单树</h5>
            </div>
            <div class="ibox-content">
                <p>
                    可以通过添加class的值为<code>.btn-lg</code>, <code>.btn-sm</code>, or <code>.btn-xs</code>来修改按钮的大小
                </p>
                <h3 class="font-bold">按钮尺寸</h3>
                <p>
                    <button type="button" class="btn btn-primary btn-lg">大按钮</button>
                    <button type="button" class="btn btn-default btn-lg">大按钮</button>
                    <br/>
                    <button type="button" class="btn btn-primary">默认按钮</button>
                    <button type="button" class="btn btn-default">默认按钮</button>
                    <br/>
                    <button type="button" class="btn btn-primary btn-sm">小按钮</button>
                    <button type="button" class="btn btn-default btn-sm">小按钮</button>
                    <br/>
                    <button type="button" class="btn btn-primary btn-xs">Mini按钮</button>
                    <button type="button" class="btn btn-default btn-xs">Mini按钮</button>
                </p>
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <h5>权限组</h5>
            </div>
            <div class="ibox-content">
                <div class="panel-body">
                    <div class="panel-group" id="accordion">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h5 class="panel-title">
                                    <a data-toggle="collapse" data-parent="#accordion" href="tabs_panels.html#collapseOne">标题 #1</a>
                                </h5>
                            </div>
                            <div id="collapseOne" class="panel-collapse collapse in">
                                <div class="panel-body">
                                    Bootstrap相关优质项目推荐 这些项目或者是对Bootstrap进行了有益的补充，或者是基于Bootstrap开发的
                                </div>
                            </div>
                        </div>
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a data-toggle="collapse" data-parent="#accordion" href="tabs_panels.html#collapseTwo">标题 #2</a>
                                </h4>
                            </div>
                            <div id="collapseTwo" class="panel-collapse collapse">
                                <div class="panel-body">
                                    Bootstrap相关优质项目推荐 这些项目或者是对Bootstrap进行了有益的补充，或者是基于Bootstrap开发的
                                </div>
                            </div>
                        </div>
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a data-toggle="collapse" data-parent="#accordion" href="tabs_panels.html#collapseThree">标题 #3</a>
                                </h4>
                            </div>
                            <div id="collapseThree" class="panel-collapse collapse">
                                <div class="panel-body">
                                    Bootstrap相关优质项目推荐 这些项目或者是对Bootstrap进行了有益的补充，或者是基于Bootstrap开发的
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 全局js -->
<script th:src="@{/js/jquery.min.js(v=2.1.4)}"></script>
<script th:src="@{/js/bootstrap.min.js(v=3.3.6)}"></script>

<!-- Bootstrap-Treeview plugin javascript -->
<script th:src="@{/js/plugins/treeview/bootstrap-treeview.js}" ></script>
<script th:src="@{/js/demo/treeview-demo.js}" ></script>

<script>

</script>
</body>

</html>
